<template>
	<div class="banner">
  <swiper :options="swiperOption">
    <swiper-slide>
			<img src="../assets/img/b1.jpg" alt="">
		</swiper-slide>
     <swiper-slide>
			<img src="../assets/img/b2.jpg" alt="">
		</swiper-slide>
		<swiper-slide>
			<img src="../assets/img/b3.jpg" alt="">
		</swiper-slide>
		<div class="swiper-pagination" slot="pagination"></div>
  </swiper>
	</div>
</template>

<script>
  import { swiper, swiperSlide } from 'vue-awesome-swiper'
  import 'swiper/dist/css/swiper.css'

  export default {
    components: {
      swiper,
      swiperSlide
    },
    data() {
      return {
				swiperOption:{
			     pagination:{
					   el: ".swiper-pagination",
					 },	
           autoplay: true
				}
      }
    }
  }
</script>
<style scoped>

.banner{
  padding: 10px;
}
</style>
